<template>
	<div class="share-wrapper">
		<component :is="id" @share="onShare" v-bind="params" />
	</div>
</template>

<script>
import { html2Img } from "@/utils/index.js";
import h5Mixin from "./mixins/h5Mixin.vue";
import ShareApp from "./components/ShareApp.vue";
import ShareLearnReport from "./components/ShareLearnReport.vue";
export default {
	mixins: [h5Mixin],
	components: {
		ShareApp,
		ShareLearnReport,
	},
	data() {
		return {
			id: "ShareApp",
			params: {},
		};
	},
	methods: {
		initPage() {
			const { id = "ShareApp", token = "" } = this.$route.query;
			// this.$quinn.setStorage("token", token);
			const { components } = this.$options;
			if (components[id]) {
				this.id = id;
				this.params = this.$route.query;
			} else this.id = "ShareApp";
		},
		onShare(id, opts) {
			const html = document.getElementById(id);
			this.loading = true;
			html2Img({
				html,
				scale: 2,
				type: "file",
			}).then((file) => {
				// console.log(file);
				this.$api
					.upload({
						file,
					})
					.then((res) => {
						const imgUrl = this.$imgHost + res;
						console.log("imgUrl", imgUrl);
						uni.postMessage({
							data: {
								id,
								imgUrl,
								opts,
							},
						});
						this.onBack();
						console.log(window.location.href);
					})
					.catch((e) => {
						console.log("upload", e);
					});
			});
		},
	},
};
</script>

<style lang="less" scoped>
.share-wrapper {
	widows: 100%;
	height: 100%;
}
</style>

